<template>
    <div>
        <h1>Wechat页面</h1>
        <button @click="add">count++</button>
        <button @click="minus">count--</button>
        <div>{{count}}</div>
        <div>{{name}}</div>
        <div>{{upperName}}</div>
    </div>
</template>
<script>
   import {mapState,mapGetters} from 'vuex'
    export default{
        name:'wechat',
        data:function(){
            return {

            }
        },
        methods:{
            add(){
                //当组件中需要改变Vuex中的state中的状态时；
                // this.$store.state.count ++  错误的
                // 不能直接修改，需要通过commit方法提交改变
                // para1：mutations中的方法名字符串
                // para2：可选的；
                //this.$store.commit('add',2)

            // dispatch派遣，执行actions中的异步任务
            // 返回值是一个promise对象
           	 this.$store.dispatch('add',3)
            },
            minus(){
                this.$store.commit('minus',2)
            }
        },
        //computed:mapState(['count'])
        //computed:mapGetters(['name'])
        computed: {...mapState(['count']),...mapState(['name']),...mapGetters(['upperName'])}
    }
</script>
<style scoped>

</style>
